<div class="m-l nav navbar-nav m-t block" style="width:300px;" >  
  <span>运维管理 ></span>  
  <span>资费策略 </span>    
</div>
<div class="m-t-lg">
  <div class="wrapper-sm">
  <div class="panel panel-default">
    <div class="panel-body">
      <div style="border-color: #e5e5e5;padding: 10px;background-color: #e5e5e5">
        <div class="row">         
          <div class="col-md-6">
            <div class="input-group">
                <input type="text" class="form-control" placeholder="关键字...">
                <span class="input-group-btn">
                  <button class="btn btn-default" type="button">查询</button>
                </span>
              </div>
          </div> 
          <div class="col-md-6" style="text-align: right">
            <button class="btn btn-info pull-right" (click)="btype=1; myModal.show()">
              新增
            </button>
          </div>      
        </div>
      </div>
      <div class="table-responsive">
      <table class="table table-hover table-striped">
        <thead>
          <tr>
            
              <th>策略名称</th> 
              <th>租赁方式</th>             
              <th>大号单价</th>
              <th>中号单价</th> 
              <th>小号单价</th>
              <th>充电单价</th>   
              <th>操作</th>
              
          </tr>
        </thead>
        <tbody>
          <tr>            
              <td>5435345</td>
              <td>分时租赁</td>
              <td>2.0元/时</td>
              <td>1.5元/时</td>
              <td>1.0元/时</td>
              <td>
                0.5元/时
              </td>
             
                        
              <td>
                <button class="btn btn-xs btn-success" (click)="btype=2;myModal.show()">编辑</button>
              </td>
          </tr>
        </tbody>
      </table>
      </div>
     <!--  <app-pagination [pageModel]="pageModel" (pageChanged)="getAll($event)"></app-pagination> -->
    </div>
  </div>
  </div>
</div>

<div>
  <div bsModal #myModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" style="width: 800px">
      <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title" *ngIf="btype==1">新增</h4>
        <h4 class="modal-title" *ngIf="btype==2">编辑</h4> 
  
      </div>
      <div class="modal-body">
        <form class="form-horizontal" *ngIf="btype==1||btype==2">
            <div class="form-group row" >             
              <label class="col-sm-3  control-label" style="text-align: right">策略名称</label>
              <div class="col-sm-7">
                <input type="text"  class="form-control" placeholder="请输入策略名称" name="group_name"  [(ngModel)]='group_name_new' *ngIf="btype==1">
                <input type="text"  class="form-control" placeholder="请输入群组名称" name="group_name"  [(ngModel)]='group_name_edit' *ngIf="btype==2">
              </div>
            </div> 
            <div class="form-group row" >             
              <label class="col-sm-3  control-label" style="text-align: right">租赁方式</label>
              <div class="col-sm-7">
                <select class="form-control">
                	<option>分时租赁</option>
                	<option>按次租赁</option>
                	<option>包月租赁</option>
                </select>
              </div>
            </div>
            <div class="form-group row" >             
              <label class="col-sm-3  control-label" style="text-align: right">大号柜子单价</label>
              <div class="col-sm-7">
                <input type="text"  class="form-control" placeholder="请输入大号柜子单价" name="group_name"  [(ngModel)]='group_name_new' *ngIf="btype==1">
                <input type="text"  class="form-control" placeholder="请输入大号柜子单价" name="group_name"  [(ngModel)]='group_name_edit' *ngIf="btype==2">
              </div>
            </div>
            <div class="form-group row" >             
              <label class="col-sm-3  control-label" style="text-align: right">中号柜子单价</label>
              <div class="col-sm-7">
                <input type="text"  class="form-control" placeholder="请输入中号柜子单价" name="group_name"  [(ngModel)]='group_name_new' *ngIf="btype==1">
                <input type="text"  class="form-control" placeholder="请输入中号柜子单价" name="group_name"  [(ngModel)]='group_name_edit' *ngIf="btype==2">
              </div>
            </div>
            <div class="form-group row" >             
              <label class="col-sm-3  control-label" style="text-align: right">小号柜子单价</label>
              <div class="col-sm-7">
                <input type="text"  class="form-control" placeholder="请输入小号柜子单价" name="group_name"  [(ngModel)]='group_name_new' *ngIf="btype==1">
                <input type="text"  class="form-control" placeholder="请输入小号柜子单价" name="group_name"  [(ngModel)]='group_name_edit' *ngIf="btype==2">
              </div>
            </div>
            <div class="form-group row" >             
              <label class="col-sm-3  control-label" style="text-align: right">充电单价</label>
              <div class="col-sm-7">
                <input type="text"  class="form-control" placeholder="请输入充电单价" name="group_addr"  [(ngModel)]='group_addr_new' *ngIf="btype==1">
                <input type="text"  class="form-control" placeholder="请输入充电单价" name="group_addr"  [(ngModel)]='group_addr_edit' *ngIf="btype==2">
              </div>             
            </div> 
        </form>
        <div *ngIf="btype==3">
          <div style="background-color: #e5e5e5;border:1px solid #e5e5e5;padding: 10px;font-size: 14px;border-radius: 5px;font-weight: bold;">
            你确定要启用该群组嘛？
          </div>
        </div>
        <div *ngIf="btype==4">
          <form class="form-horizontal">
              <div class="form-group row" >             
                <label class="col-sm-3  control-label" style="text-align: right">资费名称</label>
                <div class="col-sm-7">
                  <select class="form-control">
                    <option>sdasdd</option>
                    <option>mdfffg</option>
                  </select>
                </div>
              </div>
          </form>
        </div>
        <div *ngIf="btype==5">
          <form class="form-horizontal">
              <div class="form-group row" >             
                <label class="col-sm-3  control-label" style="text-align: right">设备IDs</label>
                <div class="col-sm-7">
                  <input type="text" name="" class="form-control" placeholder="请输入设备id，多个设备请以逗号隔开">
                </div>
              </div>
          </form>
        </div>
      </div>
      <div class="modal-footer">
        <button class="btn btn-info confirm-btn" *ngIf="btype==1">保存</button>
        <button class="btn btn-success confirm-btn" *ngIf="btype==2">保存</button>       
        <button class="btn  confirm-btn " (click)="myModal.hide();cancel();">取消</button>
      </div>
    </div>
     
    </div>
  </div>
</div>
